<div id="all_search_div"></div>
<script>
    Ext.onReady(function(){
        var dateBegin = new Ext.form.DateField({
            fieldLabel: '<span class="red">*</span>开始日期',
            name: 'date_begin',
            id: 'date_begin',
            format: 'Y-m-d', //格式化日期
            width: '80',
            //disabledDays: [0,6],	//不让选择周六，周日
            //disabledDaysText: "周末要休息",
            invalidText: "您输入的日期格式不对，正确格式为2008-01-01",
            allowBlank: false,
            inputType: '2008-01-01',
            anchor: '90%',
            vtype: 'daterange',
            endDateField: 'date_end'
        });

        var dateEnd = new Ext.form.DateField({
            fieldLabel: '<span class="red">*</span>结束日期',
            name: 'date_end',
            id: 'date_end',
            format: 'Y-m-d', //格式化日期
            width: '80',
            //disabledDays: [0,6],	//不让选择周六，周日
            //disabledDaysText: "周末要休息",
            invalidText: "您输入的日期格式不对，正确格式为2008-01-01",
            allowBlank: false,
            inputType: '2008-01-01',
            anchor: '90%',
            vtype: 'daterange',
            startDateField: 'date_begin'
        });
        var searchButton = new Ext.Button({
            text: '搜 索',
            handler: searchByAll
        })
        var formPanel = new Ext.form.FormPanel({
            //baseCls: 'x-plain',
            labelWidth: 75,
            width: '500',
            labelAlign: 'right',
            frame: true,
            items: [{
                    layout: 'column',
                    border: false,
                    items: [{
                            columnWidth: .4,
                            layout: 'form',
                            border: false,
                            items: [dateBegin]
                        },{
                            columnWidth: .4,
                            layout: 'form',
                            border: false,
                            items: [dateEnd]
                        },{
                            columnWidth: .2,
                            layout: 'form',
                            border: false,
                            items: [searchButton]
                        }]
                }]
        });
        formPanel.render('all_search_div');
        function searchByAll(){
            if (formPanel.form.isValid()) {
                webOrderDS.removeAll();
                webOrderDS.baseParams.date_begin = dateBegin.getValue().format("y-m-d");
                webOrderDS.baseParams.date_end = dateEnd.getValue().format("y-m-d");
                webOrderDS.load({
                    params: {
                        start: 0,
                        limit: 10
                    }
                });
                webOrderDS.baseParams.date_begin=null;
                webOrderDS.baseParams.date_end=null;
            }
        }
    });
</script>
